var HistoryRecord = function () {
  var template = /* html */ `
    <div class="history-record" v-loading.fullscreen.lock="loading">
      <template v-if="recordList!==null">
        <template v-if="recordList.length>0">
        <div class="history-record-item" style="margin-bottom:15px">
          <div class="history-record-item-title">历史备注记录</div>
          <div class="history-record-item-content">
            <div>系统编号[{{orderNo}}]</div>
            <template v-for="(record,index) in recordList">
            <div :key="'record_'+index" class="history-record-text">
              <div>由[{{record.apply_user}}]于[{{record.apply_time}}]备注为[{{record.apply_remark}}]提交申请</div>
              <div>由[{{record.apply_user}}]于[{{record.audit_time}}]备注为[{{record.audit_remark}}]审核结果为[{{record.status}}]</div>
            </div>
            </template>
          </div>
        </div>
        <div class="history-record-item">
          <div class="history-record-item-title">历史系统记录</div>
          <div class="history-record-item-content">
            <template v-for="(record,index) in recordList">
              <div :key="'record_'+index" class="history-record-text">
                <div>申请编号[{{record.apply_id}}]修改内容为[{{record.audit_special_remark}}]</div>
              </div>
            </template>
          </div>
        </div>
        </template>
        <div v-else class="no-data">无历史记录</div>
      </template>
    </div>
  `;

  return {
    props: {
      data: {
        type: Object,
        default: function () {
          return {};
        }
      },
      orderNo: {
        type: String,
        reqired: true
      }
    },

    data: function () {
      return {
        loading: false,
        recordList: null
      };
    },

    created: function () {
      this.loading = true;
      var self = this;
      this.initData().then(function () {
        self.loading = false;
      }).catch(function () {
        self.loading = false;
      });
    },

    methods: {
      initData: function () {
        var data = this.data;
        var recordList = data.recordList;
        if (recordList !== undefined) {
          this.recordList = recordList;
          return Promise.resolve(recordList);
        }

        var orderNo = this.orderNo;
        var self = this;
        return ajaxRequest('createOrderApply/getRemarkData', {
          order_no: orderNo
        }).then(function (recordList) {
          self.recordList = recordList;
          // data.recordList = recordList;
          return recordList;
        });
      }
    },

    template: template
  };
}();
